<%@page import="com.wanmait.cookBook.vo.IndexPicture"%>
<%@page import="java.util.List"%>
<%@page import="com.wanmait.cookBook.vo.Userinfo"%>
<%@page import="java.util.ArrayList"%>
<%@page import="com.wanmait.cookBook.vo.Like"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%String path = request.getContextPath();%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8;" />
<meta http-equiv="pragma" content="no-cache" />
<meta property="qc:admins" content="10660160706551301301616375" />
<title></title>
<meta name="keywords" content="美食,菜谱,烹饪,家常菜谱大全,美食网,美食天下" />
<meta name="description" content="美食天下是最大的中文美食网站与厨艺交流社区，拥有海量的优质原创美食菜谱，聚集超千万美食家。我所有的朋友都是吃货，欢迎您加入！" />
<meta name="msapplication-t
ooltip" content="美食天下" />
<meta name="renderer" content="webkit">
<meta name="msapplication-task" content="name=美食天下; action-uri=https://www.meishichina.com/; icon-uri=https://static.meishichina.com/v6/img/lib/f.ico" />
<meta http-equiv="mobile-agent" content="format=xhtml; url=https://m.meishichina.com/">
<link rel="alternate" media="only screen and (max-width: 640px)" href="https://m.meishichina.com/">
<link rel="shortcut icon" href="https://static.meishichina.com/v6/img/lib/f.ico"/>
<link rel="apple-touch-icon" href="https://static.meishichina.com/v6/img/lib/wapico.png" />
<link rel="stylesheet" type="text/css" href="https://static.meishichina.com/v6/css/lib/all.css?v1=13">
<link rel="stylesheet" type="text/css" href="https://static.meishichina.com/v6/css/lib/wwwindex2.css?v1=2019-01-30">
</head>
<body>
<!-- head 开始-->
<div style="z-index:1000;">
<jsp:include page="/front/head.jsp"></jsp:include>
<!-- head 结束-->
</div>
<div class="w logo_wrap2" style="margin-top:10px;height:60px;padding:0;margin-bottom:10px;">
<div class="logo_inner left" >
<a href="https://www.meishichina.com/" title="美食天下">美食天下</a>
</div>
<div class="logo_search right">
<div class="searchBox J_search"><a href="javascript:;" title="搜索" class="search_Btn J_searchBTN right" id="search">搜索</a><input type="text" id="q" class="search_Text J_searchTxt right">
</div>
</div>
<div class="logo_nav">
<a  href="<%=path %>/IndexServlet" class="on" target="_blank" style="font-size:16px;">首页</a>
<a  href="<%=path %>/ShowAllCookServlet" target="_blank" style="font-size:16px;">菜谱</a>
<a  href="<%=path %>/DiaryServlet" target="_blank" style="font-size:16px;">日志</a>
<a  href="<%=path %>/ShowAllCookServlet" target="_blank" style="font-size:16px;">发布</a>
<a  href="<%=path %>/TopicServlet?action=showAllTopicServlet" target="_blank" style="font-size:16px;">话题</a>
<a  href="<%=path %>/CookServlet" target="_blank" style="font-size:16px;">个人中心</a>
</div>
</div>

<!-- -----------------------------banner--------------------------- -->
<script type="text/javascript">
$(function() {
    
    //创建图片，
    var picNum = 0;
    var i = 0;
    ////////////////////////////////////////////取request中保存的字符串
  	var str = "<%=(String)request.getAttribute("str")%>";
  	var pic = str.split(",");
	////////////////////////////////////////////取request中保存的字符串
    var a = $("<a></a>");
    a.attr("href","<%=path%>/ShowAllCookServlet");
    $(".banner").append(a);
    var img = $("<img>");
    img.attr("src", "<%=path%>/back/indexBannerImages/" + pic[0]);
    img.attr("class", "image");
    img.css("width","990px");
    img.css("height","370px");
    img.css("left","10px");
    img.css("top","0");
    $(".banner").find("a").append(img);

    //创建
    var k = 670;
    for(var i=0;i<pic.length;i++){
        var tuBiao = $("<img>");
        tuBiao.attr("src", "<%=path%>/back/indexBannerImages/yuan.png");
        tuBiao.attr("class","tubiao");
        tuBiao.attr("width", "12px");
        tuBiao.attr("height", "12px");
        tuBiao.css("position","absolute");
        tuBiao.css("left",k+"px");
        tuBiao.css("opacity","0.5");
        tuBiao.attr("cid",i);
        k += 25;
        tuBiao.css("top","440px");
        $(".banner").append(tuBiao);
    }
    //更换
    function changeImg() {
        var prevObj = picNum-1;
        if(prevObj==-1){
            prevObj = pic.length-1;
        }
        var tuBiaoPrev = $(".banner").find("img[cid="+prevObj+"]");
        tuBiaoPrev.css("opacity","0.8");
        $(".banner").find(".image").attr("src", "<%=path%>/back/indexBannerImages/" + pic[picNum]);
        var tuBiao = $(".banner").find("img[cid="+picNum+"]");
        tuBiao.css("opacity","1");
        picNum++;
        if (picNum == pic.length) {
            picNum = 0;
        }
    }
    var interObj = setInterval(changeImg, 3000);
    //事件加给图标
    $(".banner").on("mouseover","img[class=tubiao]",function(){
        $(".banner").find("img[class=tubiao]").css("opacity","0.5");
        $(this).css("opacity","1");
        var num = $(this).attr("cid");
        $(".banner").find(".image").attr("src", "<%=path%>/back/indexBannerImages/" + pic[num]);
        clearInterval(interObj);
    });
    
    $(".banner").on("mouseout","img[class=tubiao]",function(){
         picNum = $(this).attr("cid");
        interObj = setInterval(changeImg, 3000);
        
    });

});
</script>
<div class="banner" style="clear:both;">

</div>
<style type="text/css">
	.banner
	{
		margin: 0 auto;
		height:402px;
		width:992px;
		margin-bottom:-10px;
	}
	 .yuan {
            position: absolute;
        }
</style>

<!-- ---------显示用户最新发布的日志----------------------- -->
<style type="text/css">
	#w2_slider a
	{
		opacity:0.8;
	}
	#diaryDiv{
	margin-top:6px;
	margin-bottom:-20px;
	width:745px;
	background-color:#FDFDFD;
	}
</style>
<div style="overflow:hidden;width:990px; margin:0px auto;">
<div id="diaryDiv" style="float:left;height:400px;"  >
	<h2 style="font-size:16px;margin-bottom:10px;opacity:0.8;margin-left:10px;"><a href="" style="color:red;">精华日志</a></h2>
	<ul class="diaryUl">
		<%ArrayList<Like> topThreeDiary = (ArrayList<Like>)request.getAttribute("topThreeDiary"); %>
		<%for(Like like:topThreeDiary){%>
		<li>
			<span><a style="font-size:18px;opacity:0.8;text-decoration:none;" target="_blank" href="<%=path %>/DiaryServlet?action=showDiary&diaryId=<%=like.getDiary().getId() %>">【<%=like.getDiary().getDiaryName() %>】</a></span>&nbsp; &nbsp;
			<span><a style="font-size:14px;color:#C3CCC9; text-decoration:none;" target="_blank" href="<%=path %>/DiaryServlet?action=showDiary&diaryId=<%=like.getDiary().getId() %>"><%=like.getUserinfo().getUserName() %></a></span>
			<br>
			<span  style="margin-left:10px; margin-top:5px;margin-bottom:10px;display:block; "><a target="_blank" style="text-decoration:none;q" href="<%=path %>/DiaryServlet?action=showDiary&diaryId=<%=like.getDiary().getId() %>"><%=like.getDiary().getDiaryContext() %></a></span>
		</li>	
	<% } %>
	
	</ul>
</div>
<!-- ------------------人气美食家 ----------------------------------------------->
<!-- 显示菜谱点赞次数最多的用户 -->
<div style="float:left; width:235px;margin-left:10px;height:400px; ">
<h2 style="font-size:16px;margin-bottom:5px;margin-top:5px;opacity:0.8;"><a href="" style="color:red">人气美食家</a></h2>
	<ul style="margin:0;padding:0;">
	<%List<Userinfo> mostLikeUser =(List<Userinfo>) request.getAttribute("mostLikeUser"); %>
	<%for(Userinfo user:mostLikeUser){%>
		<li style="float:left;list-style:none;margin-left:5px;margin-bottom:5px;">
			<img style="width:50px;height:50px;" src="<%=path %>/front/userImages/<%=user.getUserFace() %>"><br>
			<span><%=user.getUserName() %></span>
		</li>
	<%} %>
</ul>
</div>
</div>
<!-- -------------------------- -->
<div class="w5" style="clear:both;margin-top:10px;margin:0 auto;width:990px;">
<div class="ui_title">
	<div class="ui_title_wrap clear" >
		<h3><a href="javascript:void(0);" class="allCook" style="font-size:16px;font-weight:500;opacity:0.9;">全部</a></h3>
		<h3><a href="javascript:void(0);" class="newPublishCook"  style="font-size:16px;font-weight:500;opacity:0.9;">最新 </a></h3><!-- 最新发布的8条 -->
		<h3><a href="javascript:void(0);" class="hotCook"  style="font-size:16px;font-weight:500;opacity:0.9;">热门</a></h3><!-- 点赞次数最多的8条 -->
		<!--<h3><a href="javascript:void(0);" class="mostHotCook"  style="font-size:16px;font-weight:500;opacity:0.9;">精华 </a></h3><!-- 点赞和收藏次数最多的8条 -->
	</div>
</div>
</div>
<style type="text/css">
	.cookList{
	width:990px;
	margin:10px auto;
	overflow:hidden;
	}
	.cookList>ul{
	width:230px;
	height:260px;
	float:left;
	margin:0px;
	padding:0px;
	margin-right:16px;
	}
	.cookList>ul>li{
	list-style:none;
	}
</style>
<div class="cookList">
</div>
<!-- 显示全部 最新 精华菜谱-->
<script type="text/javascript">
	$(function(){
		$(".hotCook").click(function(){
			$.ajax({
				url:"<%=path%>/IndexServlet",
				type:"get",
				data:{action:"getMostLikeCook"},
				async:false,
				success:function(mes){
					$(".cookList").html(mes);
					$(".allCook").css("color","#000");
					$(".newPublishCook").css("color","#000");
					$(".mostHotCook").css("color","#000");
					$(".hotCook").css("color","#FF6767");
				}
			});	
		});
	});
</script>
<script type="text/javascript">
$(function(){
	$(".newPublishCook").click(function(){
		$.ajax({
			url:"<%=path%>/IndexServlet",
			type:"get",
			data:{action:"getNewPublishCook"},
			async:false,
			success:function(mes){
				$(".cookList").html(mes);	
				$(".allCook").css("color","#000");
				$(".hotCook").css("color","#000");
				$(".mostHotCook").css("color","#000");
				$(".newPublishCook").css("color","#FF6767");
			}	
		});
	});
});
</script>
<script type="text/javascript">
	$(function(){
		function getAllCook()
		{
			$.ajax({
				url:"<%=path%>/IndexServlet",
				type:"get",
				data:{action:"getAllCook"},
				async:false,
				success:function(mes){
					$(".newPublishCook").css("color","#000");
					$(".hotCook").css("color","#000");
					$(".mostHotCook").css("color","#000");
					$(".allCook").css("color","#FF6767");
					$(".cookList").html("");
					//json数组去双引号
					var jsonObject = JSON.parse(mes);
					for (var i = 0; i < jsonObject.length; i++) {
						var ul = $("<ul></ul>");
						var liImg = $("<li></li>");
						var a =$("<a></a>");
						a.attr("href","<%=path%>/ShowPersonalCookServlet?cookId="+jsonObject[i].id);
						var img = $("<img>");
						img.css("width","230px");
						img.css("height","230px");
						img.attr("src","<%=path%>/front/cookFaceImage/"+jsonObject[i].cookPicture);
						a.append(img);
						liImg.append(a);
						ul.append(liImg);
						var liName = $("<li></li>");
						liName.html(jsonObject[i].cookName);
						var liUserName = $("<li></li>");
						liUserName.html(jsonObject[i].userName);
						ul.append(liName);
						ul.append(liUserName);
						$(".cookList").append(ul);
					}
				}
			});
		}
		getAllCook();
		$(".allCook").click(getAllCook);
	});
</script>

<script type="text/javascript" src=""></script>
<script src="https://static.meishichina.com/v6/js/lib/jquery.sudoSlider.min.js" type="text/javascript"></script>
<script type="text/javascript">
msc.user.init();
$("img.imgLoad").imgLoad();
msc.goTop.init();
$("#search").click(function(){var q=$("#q").val().replace(/\s+/g,"").replace("　","");window.location.href='https://home.meishichina.com/search/'+(q==""?'':q+'/')});$("#q").keydown(function(e){if(e.keyCode==13)$("#search").click()});

var sudoSlider = $("#home_index_slider").sudoSlider({continuous: true,
auto: true,
effect: "fade",
speed: '700',
pause: '3000',
numeric: true,
resumePause: 2000,prevHtml:'<a class="prevBtn" href="javascript:void(0);"><i>&nbsp;</i></a>',nextHtml:'<a class="nextBtn" href="javascript:void(0);"><i>&nbsp;</i></a>'});

var sudoSlider2 = $("#w2_slider").sudoSlider({speed:600,slideCount:3,movecount:3,prevHtml:'<a class="prevBtn" href="javascript:void(0);"><i>&nbsp;</i></a>',nextHtml:'<a class="nextBtn" href="javascript:void(0);"><i>&nbsp;</i></a>',continuous: true});

$(".w1_1 >ul >li").hover(function(){
$(this).addClass("on").find(".sub").show();
},function(){
$(this).removeClass("on").find(".sub").hide();
});

$(".w3live .ui_title_wrap h2 a").click(function(){
		if($(this).parent().hasClass('on'))
		return false;
		else{
		$(this).closest('.w3live').find("h2").removeClass('on');
		$(this).parent().addClass('on');
		$(this).closest('.w3live').find('.live').hide();
		$(this).closest('.w3live').find(".live:eq("+$(this).parent().index()+")").fadeIn();
		}
		});

$(".w5 .ui_title_wrap h3 a").click(function(){
		if($(this).parent().hasClass('on'))
		return false;
		else{
		$(".w5 .ui_title_wrap h3").removeClass('on');
		$(this).parent().addClass('on');
		$(".w5 ul").hide();
		$(".w5 ul:eq("+$(this).parent().index()+")").fadeIn();
		}
		});

$(".w6 .ui_title_wrap h3 a").click(function(){
		if($(this).parent().hasClass('on'))
		return false;
		else{
		$(".w6 .ui_title_wrap h3").removeClass('on');
		$(this).parent().addClass('on');
		$(".w6 .live").hide();
		$(".w6 .live:eq("+$(this).parent().index()+")").fadeIn();
		}
		});
</script>
<script>
$("li.top_bar_more").hoverDelay(function(){$("li.top_bar_more div").show()},function(){$("li.top_bar_more div").hide()},200,200);var _hmt=_hmt||[];(function(){var hm=document.createElement("script");hm.src="//hm.baidu.com/hm.js?fb9cd9dcdda23cee0c7357db9be24acb";var s=document.getElementsByTagName("script")[0];s.parentNode.insertBefore(hm,s)})();
</script>
<!-- 包含footer.jsp -->
<div class="footer" style="clear:both;">
<jsp:include page="/front/footer.jsp"></jsp:include>
</div>
</body>
</html>
